<template>
	<div class="login">
		<div class="bax">
			<div class="log">
				<el-page-header @back="back">
				</el-page-header>
				<form>
					<span>姓名:<input type="text" v-model="info.name" /></span>
					<span>电话:<input type="text" v-model="info.phone" /></span>
					<span>地址:<input type="text" v-model="info.addr" /></span>
				</form>
				<div class="but">
					<button @click="updetd">修改</button>
					<!-- <button @click="back">返回</button> -->
				</div>
			</div>
		</div>
	</div>
</template>

<script>
	import {
		mapActions,
		mapState
	} from 'vuex';
	import Statusbar from '@/components/pc/default/Statusbar.vue'

	export default {
		name: 'Mobileinfo', //登录
		components: {
			Statusbar
		},
		data() {
			return {
				info: {},
			}
		},
		methods: {
			updetd() {
				let param = new FormData();
				param.append("nickname",this.info.name)
				param.append("phone",this.info.phone)
				param.append("addr",this.info.addr)
			this.$axios.post("/api/user/updateShip",param,{
					headers: {
						'Content-Type': 'multipart/form-data'
					}
				},).then((res) => {
				if (res.status == 200) {
					console.log(res.data);
					this.$message({
						message: '修改成功',
						type: 'success'
					})
					this.$router.go(-1);
				}
			}).catch((error) => {
				console.log(error);
			})
			},

			back() {
				this.$router.go(-1);
			}
		},
		created() {
			this.$axios.get("/api/user/shipInfo").then((res) => {
				if (res.status == 200) {
					this.info = res.data.data
				}
			}).catch((error) => {
				console.log(error);
			})
		}
	}
</script>

<style scoped>
	.login .bax {
		background-color: #92c87a;
		width: 100%;
		height: 100%;
		position: fixed;
		bottom: 0;
		background-size: 100% 100%;
color: white;
	}


	.login .log span {
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.login .log form {
		margin: auto;
		display: flex;
	margin-top: 40%;
		flex-direction: column;
		width: 100%;
		height: 100%;
		color: white;


	}

	.login .log input {
		/* background: transparent;
		color: #fff;
		border-radius: 10px; */
		/* border: none; */
		/* outline: none; */
		/* border-bottom: 1px solid white;
		width: 100%; */
	}

	.login .log form input[type="text"] {
		width: 80%;
		height: 3rem;
		margin: 20px auto;
	}

	.login .log .but {
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.login .log button {
		outline: none;
		border: none;
		width: 40%;
		height: 3rem;
		margin: 0px 20px 0 0;
		background-image: linear-gradient(to right, #fffae8, #8da7c8);

	}
</style>